<template>
    <div>
        <div class='editdetail'>
            <h3>生成邀请码</h3>
            <el-form :model="ruleForm" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="用户wxUid:" prop="wxUid">
                    <el-input class='input' v-model="ruleForm.wxUid"></el-input>
                </el-form-item>
                <el-form-item label="生成数量:" prop="num">
                    <el-input-number class='input' :min="0" :max="1000" v-model="ruleForm.num" :step="10"></el-input-number>
                </el-form-item>
                <el-form-item label="邀请码级别:" prop="class">
                    <el-select class='input' v-model="ruleForm.class" placeholder="请选择生成级别">
                        <el-option v-for="item in option" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item class='right-btn'>
                    <el-button class='' type="primary" @click="submitForm('ruleForm')">生成邀请码</el-button>
                    <el-button class='' type="primary" @click="goBack('ruleForm')">取消／返回</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
import { createCode } from "../../data/postData";
export default {
    mounted() {},
    data() {
        return {
            ruleForm: {
                wxUid: "",
                num: "",
                class: ""
            },
            option: [
                {
                    value: "0",
                    label: "父级"
                },
                {
                    value: "1",
                    label: "子级"
                }
            ]
        };
    },
    methods: {
        //生成邀请码
        submitForm() {
            let params = {
                data: {
                    wxUid: this.ruleForm.wxUid,
                    num: "" + this.ruleForm.num,
                    class: this.ruleForm.class
                }
            };
            this.$fetch
                .post(createCode, params)
                .then(res => {
                    console.log(res.data);
                    this.$message({
                        message: res.message,
                        type: "success",
                        duration: 1000
                    });
                    setTimeout(() => {
                        this.$router.push({ path: "/userCodeList" });
                    }, 1200);
                })
                .catch(err => {
                    this.$message({
                        message: err.message,
                        type: "error",
                        duration: 1000
                    });
                });
        },
        goBack() {
            this.$router.go(-1);
        }
    }
};
</script>
<style scoped lang='less'>
.editdetail {
    width: calc(~"100% - 250px");
    margin-top: 5%;
    margin-left: 230px;
    float: left;
    h3 {
        margin: 20px 0px;
    }
    .input {
        width: 33%;
    }
    .right-btn {
        position: absolute;
        right: 5%;
        margin-top: 40px;
    }
}
</style>
